<template>
  <div class="app-container">
    <img alt="Vue logo" src="../assets/logo.png" />
    <el-row :gutter="10">
      <el-col :span="24" :xs="24">
        <el-input v-model="info"></el-input>
        <p></p>
        <el-button type="primary" @click="reset"> 重置 </el-button>
        <el-button type="primary" @click="read"> 读取API接口 </el-button>
      </el-col>
    </el-row>
  </div>
</template>

<script>
  import { hello } from "@/api/index";
  export default {
    data() {
      return {
        info: "点击下方按钮",
      };
    },
    created() {},
    methods: {
      reset() {
        this.info = "点击下方按钮";
      },
      read() {
        hello().then((response) => {
          this.info = response.data;
        });
      },
    },
  };
</script>